<template>
	<view class="hard" v-for="item,index in xun" :key="index">
		<ul class="nav">
			<li>
				<span>设备编码</span>
				<p>{{item.code}}</p>
			</li>
			<li>
				<span>设备名称</span>
				<p>{{item.name}}</p>
			</li>
			<li>
				<span>设备地址</span>
				<p>{{item.address}}</p>
			</li>
			<li>
				<span>所属企业</span>
				<p>{{item.belong_comp}}</p>
			</li>
		</ul>
		<!--  -->
		<uni-section title="最近巡检情况" type="line" style="margin-bottom: 3px;" class="link">
			<button type="primary" v-for="item,index in xun" :key="index">
				<image src="../../../static/mipmap-xxxhdpi/icon_normal_state.png" mode=""></image>
				{{item.last_check.status === 1 ? "正常" : "故障"}}
			</button>
			<view class="popover"></view>
			<ul class="popover1">
				<li>
					<span>巡检人员</span>
					<p>{{item.last_check.check_man}}</p>
				</li>
				<li>
					<span>巡检时间</span>
					<p>{{item.last_check.check_time}}</p>
				</li>
			</ul>
		</uni-section>
		<!--  -->
		<uni-section title="巡检结果" type="line" style="margin-bottom: 3px;" class="link1">
				<!-- <label class="radio"><radio value="r1" checked="true" />正常</label>
				<label class="radio"><radio value="r2" />故障</label> -->
				<textarea rows="4" cols="50" wrap="soft" placeholder="巡检描述"></textarea>
				<image src="../../../static/mipmap-xxxhdpi/icon_append.png" mode=""></image>
		</uni-section>
		<button type="primary">提交巡检</button>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue"
	import {
		Dimensional,
		Inspection
	} from "@/utils/file.js"
	import {
		onLoad
	} from "@dcloudio/uni-app";
	
	let deviceCode =ref("")
	
	let xun = reactive([])
	
	onLoad((options) => {
		deviceCode.value = options.deviceCode
		console.log(deviceCode.value);
		
		Dimensional(uni.getStorageSync("token"), deviceCode.value).then(res => {
			console.log(res.data.data, "巡检");
			xun.push(...[res.data.data])
		})
		
	})
	
	
	
</script>
<!-- // Inspection(uni.getStorageSync("token"),true,"","",'00080145000003',"2020-05-26","11","22",0).then(res=>{
	// 	console.log(res);
	// }) -->

<style scoped lang="scss">
	html,
	body {
		background-color: #e2e2e2;
	}

	.nav {
		width: 750rpx;
		height: 300rpx;
		background-color: #ffffff;
		top: 30rpx;
		list-style: none;
		margin-top: 20rpx;
		padding: 0;

		li {
			width: 100%;
			height: 70rpx;
			// background-color: pink;
			margin-top: 4rpx;
			line-height: 70rpx;
			color: #5b5b5b;

			p {
				display: inline-block;
				float: right;
				margin-right: 30rpx;
			}
		}
	}

	.link {
		position: relative;
		margin-top: 20rpx;

		button {
			position: absolute;
			width: 125rpx;
			height: 70rpx;
			right: 20rpx;
			top: 5rpx;
			font-size: 18rpx;

			image {
				width: 30rpx;
				height: 30rpx;
				margin-left: -20rpx;
				top: 6rpx;
			}
		}

		.popover {
			width: 300rpx;
			height: 300rpx;
			background-color: #d8d8d8;
		}

		.popover1 {
			width: 100%;
			height: 100rpx;
			// border: 1px solid;
			list-style: none;
			padding: 0;
			margin-top: 20rpx;

			li {
				width: 100%;
				height: 50rpx;
				line-height: 50rpx;
				color: #5b5b5b;

				p {
					display: inline-block;
					float: right;
					margin-right: 30rpx;
				}
			}
		}
	}

	.link1 {
		position: relative;
		margin-top: 20rpx;
		textarea{
			width: 100%;
			height: 200rpx;
		}
		image{
			width: 300rpx;
			height: 300rpx;
		}
	}
</style>